<template>
    <div>
        <!-- <h3>
            当前最新的count值为:{{ $store.state.count }}
        </h3> -->
        <h3>{{ $store.getters.showNum }}</h3>
        <button @click="btnHandler1">+1</button>
        <button @click="btnHandler2">+N</button>
        <button @click="btnHandler3">等待2s, +1</button>
        <button @click="btnHandler4">等待2s, +N</button>
    </div>
</template>

<script>
export default {
  data () {
    return {}
  },
  methods: {
    btnHandler1() {
      this.$store.commit('add')
    },
    btnHandler2(){
      // commit的作用是触发mutations
      this.$store.commit('addN', 3)
    },
    btnHandler3() {
      this.$store.dispatch('addAsync')
    },
    btnHandler4() {
      this.$store.dispatch('addNAsync', 4)
    }
  }
}
</script>
